<template>
  <div class="assesmentBox">
    <a-card>
      <a-row :gutter="20" style="padding:0 0 20px 0">
        <a-col :span="24">
          <a-radio-group v-model="timeType" :options="TimeTypeLists" @change="timeTypeHandle"></a-radio-group>
          <a-range-picker v-if="timeType == 0" @change="onTimeChange" />
        </a-col>
      </a-row>
      <a-table
        :bordered="true"
        :columns="tableColumns"
        :data-source="tableDataLists"
        :rowKey="
          (record, index) => {
            return index;
          }
        "
        :pagination="paginationOpt"
        @change="handleTableChange"
        :loading="isLoading"
      ></a-table>
    </a-card>
  </div>
</template>

<script>
import api from '@/api/userConfig';
import { getRoleId } from '@/unit/tool';
import { columns } from './components/tableConfig';

const TimeTypeLists = [
  {
    label: '一周',
    value: 1,
  },
  {
    label: '两周',
    value: 2,
  },
  {
    label: '半年',
    value: 3,
  },
  {
    label: '一年',
    value: 4,
  },
  {
    label: '时间段',
    value: 0,
  },
];

export default {
  data() {
    return {
      // userName: '',
      // role: '',
      companyId: '',
      timeType: 1,
      TimeTypeLists: TimeTypeLists,
      startTime: '',
      endTime: '',
      tableColumns: columns,
      tableDataLists: [],
      isLoading: false,
      paginationOpt: {
        current: 1,
        defaultCurrent: 1, // 默认当前页数
        defaultPageSize: 8, // 默认当前页显示数据的大小
        total: 0, // 总数，必须先有
        showTotal: (total) => `共 ${total} 条`, // 显示总数
        // 点击分页时事件
        onChange: (current, size) => {
          this.getTableData({ pageNum: current }, 'tableDataLists');
        },
      },
    };
  },
  methods: {
    async getTableData(parames, key) {
      this.isLoading = true;
      let { pageNum } = parames;
      const res = await api.getStaffPerfQuery({
        pageNum,
        pageSize: this.paginationOpt.defaultPageSize,
        companyId: parseInt(this.companyId),
        type: this.timeType,
        startTime: this.startTime || '',
        endTime: this.endTime || '',
      });

      this.isLoading = false;
      if (res.msgCode != 0) {
        return;
      }

      this.paginationOpt.total = res.data.totalNum;
      this[key] = res.data.resultList;
    },

    handleTableChange(pagination) {
      this.paginationOpt.current = pagination.current;
    },

    // 选择自定义时间
    timeTypeHandle(e) {
      // let value = e.target.value;
      // switch (parseInt(value)) {
      //   case 1:
      //     break;
      //   case 1:
      //     break;
      //   default:
      //     break;
      // }
      // if (parseInt(value) != 0) {
      //   this.getTableData({ pageNum: 1,  }, 'tableDataLists');
      // } else {
      //   this.getTableData({ pageNum: 1 }, 'tableDataLists');
      // }
      let value = e.target.value;
      if (parseInt(value) != 0) {
        this.getTableData({ pageNum: 1 }, 'tableDataLists');
      }
    },

    // 时间选择
    onTimeChange(e) {
      let [startTime, endTime] = e;
      if (e.length > 0) {
        this.startTime = `${this.$Moment(startTime).format('YYYY-MM-DD')} 00:00:00`;
        this.endTime = `${this.$Moment(endTime).format('YYYY-MM-DD')} 23:59:59`;
      } else {
        this.startTime = '';
        this.endTime = '';
      }
      this.getTableData({ pageNum: 1 }, 'tableDataLists');
    },
  },
  mounted() {
    // 获取useInfo
    // getRoleId(this);
    let roleId = localStorage.getItem('roleId');
    if (roleId == 1) {
      this.companyId = localStorage.getItem('compid');
    } else {
      this.companyId = localStorage.getItem('choseCompanyId');
    }
    this.getTableData({ pageNum: 1 }, 'tableDataLists');
  },
  created() {},
};
</script>

<style scoped lang="less">
@import './index.less';
</style>
